import React from 'react'
import { ALLSTATE, ITEMTYPE } from "../../../types/store.d"
import { useDispatch, useSelector } from "react-redux"
import { NavBar, Toast, ProductCard, Tag, Button, SubmitBar, Checkbox } from 'react-vant';

function Shopcar() {
  const shopcarArr = useSelector((state: ALLSTATE) => {
    return state.shopcarArr
  })
  return (
    <div className="shopcar">
      <NavBar
        title="购物车"
        leftText="返回"
        onClickLeft={() => Toast('返回')}
      />
      {
        shopcarArr && shopcarArr.length > 0 ? shopcarArr.map((item, index) => {
          return <div style={{ display: "flex" }} key={index}>
            <ProductCard style={{ width: "100%" }}
              num={item.num}
              price={item.price}
              title={item.title}
              thumb={item.img}
            />
          </div>
        }) : "暂时没有数据"
      }
      <SubmitBar
        buttonText="提交订单"
      >
        <Checkbox>全选</Checkbox>
        <Checkbox>反选</Checkbox>
      </SubmitBar>
    </div>
  )
}

export default Shopcar